/*WIDGETS AND DASHBOARD*/ /*WIDGETS AND DASHBOARD*/
.widget{
	width:284px;
	display:inline-block;
	background-color:white;
	vertical-align:top;
	box-shadow:3px 3px 10px rgb(152, 152, 152);
	position:relative;
	margin:18px 12px 10px 12px;
	border-radius:3px;
}
.widget:hover{
	opacity:1;
	box-shadow:4px 4px 8px rgb(179, 179, 179);
	text-decoration:none;
}
.widget.dashboard{
	height:160px;
}
.widget.dashboard:hover{
	outline:2px solid rgb(144,171,241);
}
.widget.dashboard:active{
	outline:2px solid rgb(241, 144, 218);
}
.dashboard-title{
	font-family:'Source Sans Pro', sans-serif;
	margin-top:25px;
	font-size:17px;
	text-transform:uppercase;
	letter-spacing:1px;
	color:#868686;
}
.widget-title{
	background-color:rgb(248, 248, 247);
	padding:4px 14px;
	font-size:13px;
	text-transform:uppercase;
	color:#666666;
	border-bottom:1px solid #dddddd;
	letter-spacing:1px;
	border-top-right-radius:3px;
	border-top-left-radius:3px;
}
.widget-title .new{
	font-weight:bold;
	color:rgb(214, 60, 60);
}
.widget-title.sub{
	text-align:left;
	font-size:12px;
	border-top:1px solid #ECECEC;
	letter-spacing:0px;
	background-color:rgb(245, 245, 245);
	line-height:12px;
	margin-top:-1px; /* for the previous form underline */
	border-top-right-radius:0px;
	border-top-left-radius:0px;
	margin-left:5px;
	margin-right:5px;
	border-right:1px solid #dddddd;
	border-left:1px solid #dddddd;
	border-top:1px solid #dddddd;
}
.widget-title.sub.first{
	margin-top:-1px;
	border-top:1px solid #dddddd;
}
.widget-title > i{
	color:#999999;
	margin-top:1px;
	margin-left:-12px;
	vertical-align:top;
	font-size:14px;
}
.widget-title > i.control{
	margin:1px 3px 0px 0px;
	color:#dddddd;
	cursor:pointer;
	position:absolute;
	right:0px;
}
.widget-title > i.control:hover{
	color:#aaaaaa;
}
.widget-title i.close-options{
	left:0px;
	right:initial;
	position:absolute;
	margin-left:5px;
	cursor:pointer;
}
.widget-title i.close-options:hover{
	color:#999999;
}

/*FORMS READ AND EDIT*/ /*FORMS READ AND EDIT*/
.form-input{
	border-bottom:1px solid #eeeeee;
	text-align:left;
}
.form-input-label{
	display:inline-block;
	width:70px;
	text-align:right;
	color:#999999;
	padding:7px 4px;
	border-right:1px solid #eeeeee;
	text-transform:uppercase;
	font-size:11px;
}
.form-input-value{
	display:inline-block;
	width:205px;
	text-align:left;
	color:rgb(184,98,41);
	vertical-align:top;
	border-left:1px solid #eeeeee;
	margin-left:-1px;
}
.form-input-value-list{
	vertical-align:top;
	line-height:17px;
	font-size:11px;
	color:#444444;
	width:205px;
}
.form-input-value-list input[type=checkbox]{
	margin:4px !important;
}

/* hide if widget is not of class .edit*/
.widget input, 
.widget select, 
.widget textarea, 
.widget.edit button[name=edit],
.widget .form-input-value-list,
.widget .form-input-instructions
{display:none;}

/* hide placeholder in widget not of class .edit */
.widget .form-input-value span.placeholderjs{
	visibility:hidden;
}
/* show placeholder in widget of class .edit */
.widget.edit .form-input-value span.placeholderjs{
	visibility:visible;
}

/*show the following if widget.edit exists*/
.widget.edit input, .widget.edit select, .widget.edit textarea, 
.widget.edit button[name=save], .widget.edit button[name=cancel], .widget.edit .widget-input-instructions, 
.widget.edit .form-input-input-value,.widget.edit .form-input-value-list
{display:inline-block;}
.widget.edit .form-input-instructions{display:block;}

/* hide if widget.edit */
.widget.edit .form-input-input-value{
	display:none;
}

.form-input-input-value{
	margin:6px 4px;
	display:inline-block;
}

.form-input-value input{
	width:188px;
	display:none;
	margin:4px 4px;
}
.form-input-value input[type=checkbox]{
	width:14px;
	margin-top:8px;
	margin-left:5px;
}
.form-input-value select{
	width:192px;
	display:none;
	margin:4px 4px;
}
.form-input-value textarea{
	width:186px;
	display:none;
	font-size:12px;
	margin:4px 4px;
}
.form-input-instructions{
	background-color:#f3f3f3;
	padding:2px;
	font-size:10px;
	color:#999999;
}
.form-input-instructions i{
	font-size:13px;
	color:#aaaaaa;
	margin:1px 3px 0px 1px;
}

/*HEADER*/ /*HEADER*/
.variable-width{
	margin:18px 12px 0px 12px !important;
	height:auto;
	display:inline-block;
}
.header{
	background-color:white;
	box-shadow:3px 3px 10px rgb(170, 170, 170);
	position:relative;
	border-radius:3px;
}
.header i{
	position:absolute;
	cursor:pointer;
	color:#dddddd;
}
.header i:hover{
	color:#999999;
}
.header i.fa-home{
	top:3px;
	left:0px;
}
.header i.fa-gears{
	top:3px;
	right:0px;
}
.header-title{
	font-size:17px;
	text-transform:uppercase;
	font-family:'Source Sans Pro', sans-serif;
	margin-top:5px;
	color:#666666;
	letter-spacing:1px;
}
.header img{
	margin-bottom:4px;
}
.requiredAsterisk{
	color:rgb(215, 83, 83);
	font-size:15px;
	line-height:11px;
	vertical-align:bottom;
	margin-right:1px;
	display:none;
}
.edit .requiredAsterisk{
	display:inline-block;
}
/*options*/
.unloadedOption{
	padding:5px;
	color:rgb(184, 184, 184);
}

@media (max-width: 5000px) {
	.variable-width{width:1214px;}
	
}
@media (max-width: 2204px) {
	.variable-width{width:1214px;}
}
@media (max-width: 1886px) {
	.variable-width{width:902px;}
}
@media (max-width: 1578px) {
	.variable-width{width:592px;}
	.widget.previous{display:none;} /* for calendar view - hides previous in 2 column or less screens */
}
@media (max-width: 1270px) {
	.variable-width{width:284px;}
	.header img{height:27px;margin-bottom:2px;}
	.header-title{font-size:14px;margin-top:3px;}
}
@media (max-width: 985px) {
	.variable-width{width:592px;}
	.widget.previous{display:none;} /* for calendar view - hides previous in 2 column or less screens */
}
@media (max-width: 950px) {
	.variable-width{width:284px;}
	.header img{height:27px;margin-bottom:2px;}
	.header-title{font-size:14px;margin-top:3px;}
}
@media (max-width: 657px) {
	.variable-width{width:592px;}
	.widget.previous{display:none;} /* for calendar view - hides previous in 2 column or less screens */
}
@media (max-width: 630px) {
	.variable-width{width:284px;}
	.header img{height:27px;margin-bottom:2px;}
	.header-title{font-size:14px;margin-top:3px;}
}